<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商品展示页</title>
</head>
<body>
    <table border="1">
        <thead>
            <tr>
                <th><input type="checkbox" /></th>
                <th>商品名称</th>
                <th>商品原价</th>
                <th>商品现价</th>
                <th>商品库存</th>
                <th>商品照片</th>
<!--                <img src="img/1.jpg" alt="" />-->
                <th>状态</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody id="goodsList">

        </tbody>
    </table>

</body>
</html>
<script>

    //异步删除
    // function deleteRow(inputObj,prodid){
    //     console.log(inputObj,prodid);
    //     let res = confirm("是否删除该成员");//res返回类型是布尔类型，true表示确认删除
    //     if (!res){
    //         return;
    //     }
    //
    //     let  xml = new XMLHttpRequest();
    //     xml.onreadystatechange = function (){
    //         if (xml.readyState ==4){
    //             // let jsObj = xml.responseText;
    //             // let array = JSON.parse(jsObj);
    //             alert(xmlhttp.responseText);
    //         }
    //     }
    //     xml.open("get","/DeleteServlet?prodid="+prodid);
    //     xml.send();
    //
    // }



    //异步展示goodsList

    window.onload = function (){
        let xml = new XMLHttpRequest();
        xml.onreadystatechange = function (){
            if (xml.readyState ==4){
                    //返回服务器的数据
                        let jsonObj = xml.responseText;
                        let array = JSON.parse(jsonObj);
                        console.log(array);
                        for (let i = 0;i<array.length;i++){
                            let trObj =   document.createElement("tr");
                            let td0 =   document.createElement("td");
                            let td1 =   document.createElement("td");
                            let td2 =   document.createElement("td");
                            let td3 =   document.createElement("td");
                            let td4 =   document.createElement("td");
                            let td5 =   document.createElement("td");
                            let td6 =   document.createElement("td");
                            let td7 =   document.createElement("td");

                            trObj.appendChild(td0);trObj.appendChild(td1);trObj.appendChild(td2);trObj.appendChild(td3);
                            trObj.appendChild(td4);trObj.appendChild(td5);trObj.appendChild(td6);trObj.appendChild(td7);

                            let cbk = document.createElement("input");cbk.type ="checkbox" ;cbk.name="cbk";//第一列的元素
                            td0.appendChild(cbk);

                            td1.innerHTML = array[i].prodid;
                            td2.innerHTML = array[i].oriprice;
                            td3.innerHTML = array[i].price;
                            td4.innerHTML = array[i].totalstocks;
                            td5.innerHTML = array[i].pic;
                            td6.innerHTML = array[i].status;

                            //最后一列添加两个按钮
                            let deletInput =  document.createElement("input");
                            deletInput.type="button";deletInput.value="删除"
                            deletInput.onclick = function(){
                                deleteRow(this,empArray[i].empno);
                            }
                            let updateInput =  document.createElement("input");
                            updateInput.type="button";updateInput.value="修改"
                            td7.appendChild(deletInput);td7.appendChild(updateInput);
                            document.getElementById("goodsList").appendChild(trObj);
                        }
            }
        }


        xml.open("get","/GoodsServlet");
        xml.send(null);


    }
</script>